<div fxLayout="row" class="user-session" fxLayoutAlign="center">
  <div class="user-icon" *ngIf="showImg">
    <img [src]="localhostPath +'/'+ icon" alt="">
  </div>
  <div class="user-icon" *ngIf="!showImg">
    <div class="showGirl" *ngIf="showGirl"></div>
    <div class="showBoy" *ngIf="!showGirl"></div>
  </div>
  <div class="user-set">
    <span class="user-name">
      <b *ngIf="realName"> {{realName}}</b>
      <b *ngIf="!realName"> {{userInfo.userName}}</b>
      <i></i>
    </span>
    <div></div>
    <div class="user-setInfo">
      <ul>
        <li (click)="loginOut()">退出</li>
        <li (click)="setTings()">设置</li>
      </ul>
    </div>

  </div>

  <div class="settings" *ngIf="showSetting">

    <ul>
      <li>
        <i>用户名:</i>
        <input name="userName" type="text" placeholder="请输入用户名" [(ngModel)]="userName" readonly>
      </li>
      <li>
        <i>姓名:</i>
        <input id="realName" name="realName" type="text" placeholder="请输入姓名" [(ngModel)]="realName" (blur)="onblur(1)">
        <div *ngIf="realNameError" class="error">格式不正确！</div>
      </li>
      <li>
        <i>密码:</i>
        <input id="passWord" name="passWord" type="password" placeholder="请输入密码" [(ngModel)]="passWord"
               (blur)="onblur(2)">
        <div *ngIf="passWordError" class="error">格式不正确！</div>
      </li>
      <li>
        <i>确认密码:</i>
        <input id="confirmPassword" name="confirmPassword" type="password" placeholder="请再次输入密码"
               [(ngModel)]="confirmPasswords" (blur)="onblur(3)">
        <div *ngIf="confirmPasswordError" class="error">密码不一致！</div>
      </li>
      <li>
        <i>邮箱:</i>
        <input id="email" name="email" type="text" placeholder="请输入邮箱" [(ngModel)]="email" (blur)="onblur(4)">
        <div *ngIf="emailError" class="error">格式不正确！</div>
      </li>
      <li>
        <i>电话:</i>
        <input id="telNo" name="telNo" type="text" placeholder="请输入电话" [(ngModel)]="telNo" (blur)="onblur(5)">
        <div *ngIf="telNoError" class="error">格式不正确！</div>
      </li>
      <li>

        <i> 传真:</i>
        <input id="faxNo" name="faxNo" type="text" placeholder="请输入传真" [(ngModel)]="faxNo" (blur)="onblur(6)">
        <div *ngIf="faxNoError" class="error">格式不正确！</div>
      </li>

      <li>
        <i>头像:</i>
        <img [src]="localhostPath+'/'+ icon" alt="">
      </li>
      <li class="left">
        <div class="file">
          <!--<p-fileUpload [ngClass]="{'fileUpload-edit':!file}" name="file" (uploadHandler)="onUpload($event)"-->
                        <!--(onRemove)="onRemove($event)"-->
                        <!--cancelLabel="取消" chooseLabel="选择用户头像" accept="image/*" customUpload="true"-->
                        <!--auto="false"></p-fileUpload>-->
        </div>
      </li>
      <li class="right">
        <div class="button" (click)="onDelete()">删除</div>
      </li>
      <li>
        <button (click)="close()">关闭</button>
        <button (click)="save()" *ngIf="showSavebutton">保存</button>
      </li>
    </ul>
  </div>
</div>

